/**
 * 层
 */
function sLayer(target) {
    if(this.initialize) return;

    var thiz = target ? target : this;

    sElement.call(this, "sLayer");

    var style = thiz.style ? thiz.style : {};
    var width = style.width;
    var height = style.height;

    delete style.width;
    delete style.height;

    this.children = thiz.children ? thiz.children : [];

    /**
     * 定义style
     */
    Object.defineProperty(this, "style", { 
        get: function(){
            return style;
        },
        set: function(val){
            if(!val || typeof(val) !== "object") return;
            for(let i in val){
                style[i] = val[i];
            }
        },
        enumerable: true
    });

    /**
     * 定义width,height
     */
    Object.defineProperties(this.style, { 
        "width": {
            get: ()=>{
                return width;
            },
            set: (val)=>{
                width = val;
                updateStyle.call(this, {width: val});
            },
            enumerable: true
        },
        "height": {
            get: ()=>{
                return height;
            },
            set: (val)=>{
                height = val;
                updateStyle.call(this, {height: val});
            },
            enumerable: true
        }
    });

    /**
     * 获取指定类型子元素
     * @param {*} type 
     */
    this.getSubElement = function(type){
        if(!this.children) return null;
        
        if(!type){
            return this.children[0];
        }

        for(var i in this.children){
            if(this.children[i]._sType == type) {
                return this.children[i];
            }
        }

        return null;
    }

    //属性
    var attributes = {
        id: thiz.id,
        name: thiz.name,
        width: style.width,
        height: style.height,
        position: style.position,
        ...thiz.attributes
    };

    /**
     * 定义attribute
     */
    Object.defineProperty(this, "attributes", { 
        get: ()=>{
            attributes.width = this.style.width;
            attributes.height = this.style.height;
            attributes.position = this.style.position;
            return attributes;
        },
        set: (val)=>{
            if(!val || typeof(val) !== "object") return;
            updateAttributes.call(this, val);
        },
        enumerable: true
    });

    /**
     * 更新属性
     * @param {*} attrs 
     */
    var updateAttributes = function(attrs){
        for(var i in this.children){
            this.children[i].attributes = attrs;
        }

        this.id = attrs.id;
        this.name = attrs.name;

        if(attrs.width !== undefined){
            style.width = attrs.width;
            updateStyle({width: attrs.width});
        }

        if(attrs.height !== undefined){
            style.height = attrs.height;
            updateStyle({height: attrs.height});
        }

        if(attrs.position !== undefined){
            style.position = attrs.position;
        }

        attributes = {...attributes, ...attrs};
    }

    /**
     * 更新样式
     * @param {*} style 
     */
    var updateStyle = function(style){
        for(var i in this.children){
            this.children[i].style = style;
        }
    }

    /**
     * 表现类型
     * @param {*} presentType 
     */
    this.setPresentType = function(presentType){
        Object.defineProperty(this, "presentType", {
            get: function(){
                return presentType;
            },
            enumerable: true
        });

        this.addEventListener("mouseup", (option)=>{
            if(this.children){
                for(var i in this.children){
                    option.parent = this;
                    this.children[i].dispatchEvent("mouseup", option);
                }
            }
        })
    }

    if(thiz.presentType){
        this.setPresentType(thiz.presentType);
    }
}

/**
 * 将sElement原型上的方法和属性赋值给sLayer原型
 */
for(let i in sElement.prototype){
    sLayer.prototype[i] = sElement.prototype[i];
}